/**
 * 购买记录
 * 
 */

import { List, Badge } from 'antd-mobile';
import React from 'react';
import style from './style.module.scss';
import CommodityListItem from 'components/CommodityListItem'
import Panel from 'components/Panel';

const mok = [1, 2, 3, 4, 5, 6, 7, 8, 9]

export default () => {
    return (
        <Panel className={style.body} >
            <div className={style.list} >
                <List renderHeader={() => '购买记录'} className="my-list">
                    {mok.map(() => {
                        return (
                            <div className={style.item} >
                                <CommodityListItem
                                    img={require('./imgs/timg.jpg')}
                                    price={999}
                                    num={8}
                                    title="商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题"
                                />
                                <div>
                                    <Badge text="未发货" className={style.badge}
                                        style={{ color: ' #f19736', border: '1px solid #f19736', backgroundColor: '#fff', borderRadius: 2, }}
                                    />
                                    <Badge text="运单号:GT09382448249" className={style.badge}
                                        style={{ color: ' #f19736', border: '1px solid #f19736', backgroundColor: '#fff', borderRadius: 2, }}
                                    />
                                </div>
                            </div>
                        )
                    })}
                </List>
            </div>
        </Panel >
    )
}